<template>
	<view class="home">
		<view class="top">
			<u-image src="@/static/home/logo.png" width="403rpx" height="64rpx"></u-image>
			<view @click="scan()">
				<u-image src="@/static/home/scan.png" width="36rpx" height="36rpx"></u-image>
			</view>
		</view>
		<view class="content">
			<view class="content-item" @click="toPage('/pages/repair/wait')">
				<view class="content-item-left">
					<view class="content-item-left-title">
						待维保
					</view>
					<view class="content-item-left-dec">
						您有{{daiTotal}}个待维保订单
					</view>
				</view>
				<u-image src="@/static/home/daiweibao.png" width="92rpx" height="95rpx"></u-image>
			</view>
			<view class="content-item" @click="toPage('/pages/home/device')">
				<view class="content-item-left">
					<view class="content-item-left-title">
						全部设备
					</view>
					<view class="content-item-left-dec">
						您共有{{deviceTotal}}个设备
					</view>
				</view>
				<u-image src="@/static/home/quanbu.png" width="92rpx" height="95rpx"></u-image>
			</view>
			<view class="content-item" @click="toPage('/pages/home/incomplete')">
				<view class="content-item-left">
					<view class="content-item-left-title">
						未完成项目
					</view>
					<view class="content-item-left-dec">
						您有{{weiTotal}}个未完成项目
					</view>
				</view>
				<u-image src="@/static/home/weiwancheng.png" width="92rpx" height="95rpx"></u-image>
			</view>
		</view>

		<!-- 待提交 -->
		<view class="daitijaio" @click="toPage('/pages/home/temporaryList')">
			<u-image src="@/static/home/daitijiao.png" width="120" height="120" shape="circle"></u-image>
			<u-badge type="error" :count="dtjCount" :offset="[0, 0]"></u-badge>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				deviceTotal: 0,
				daiTotal: 0,
				weiTotal: 0,
				dtjCount: 0
			}
		},
		onLoad() {

		},
		onShow() {
			let temporaryList = uni.getStorageSync('temporaryList') || []
			this.dtjCount = temporaryList.length
			const token = uni.getStorageSync('token');
			if (!token) {
				uni.navigateTo({
					url: '/pages/login/index'
				})
			} else {
				this.equipmentQuery()
			}
		},
		methods: {
			scan() {
				uni.scanCode({
					sound: 'default',
					success: (res) => {
						uni.navigateTo({
							url: '/pages/home/scan?equipmentId=' + res.result
						})
					}
				})
				// uni.navigateTo({
				// 	url: '/pages/home/scan?equipmentId=1301511163402006528'
				// })
			},
			equipmentQuery() {
				this.$u.api.equipmentQuery({}).then(res => {
					this.deviceTotal = res.recordCount
				})
				this.$u.api.maintenanceQuery({
					state: [0]
				}).then(res => {
					this.daiTotal = res.recordCount
				})
				this.$u.api.maintenanceQuery({
					state: [1]
				}).then(res => {
					this.$u.api.repairQuery({
						state: [1]
					}).then(ress => {
						this.weiTotal = res.recordCount * 1 + ress.recordCount * 1
					})
				})
			},
			toPage(page) {
				uni.navigateTo({
					url: page
				})
			},
		}
	}
</script>
<style>
	page {
		background-color: #F5F7FA;
	}
</style>
<style lang="scss" scoped>
	.home {
		position: relative;

		.top {
			background: url('@/static/home/bg.png');
			width: 100%;
			height: 326rpx;
			background-size: cover;
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 112rpx 30rpx 150rpx;
		}

		.content {
			position: absolute;
			width: 750rpx;
			left: 0;
			top: 243rpx;
			padding: 0 28rpx;

			.content-item {
				background: url('@/static/home/item.png');
				width: 100%;
				height: 200rpx;
				background-size: cover;
				display: flex;
				align-items: center;
				justify-content: space-between;
				padding: 47rpx 56rpx 50rpx 61rpx;
				margin-bottom: 28rpx;

				.content-item-left {
					.content-item-left-title {
						font-weight: 600;
						font-size: 36rpx;
						color: #333333;
						line-height: 50rpx;
					}

					.content-item-left-dec {
						font-weight: 400;
						font-size: 26rpx;
						color: #999999;
						line-height: 37rpx;
					}
				}
			}

		}
	}

	.daitijaio {
		position: fixed;
		bottom: 140rpx;
		left: 30rpx;
		z-index: 9;
	}
</style>